import {
  getMusicBanner
} from '../../services/music'
import {
  getPlaylistDetail
} from '../../services/music'
import {
  getSongMenuList
} from '../../services/music'
import recommendStore from '../../store/recommendStore'
import rankingStore from '../../store/rankingStore'
import querySelect from '../../utils/query-select'
import zehrottle from '../../utils/throttle'
import playerStore from '../../store/playerStore'

const querySelectThrottle = zehrottle(querySelect, 100)
const app = getApp()
Page({
  data: {
    searchValue: "",
    musicBanner: [],
    bannerHeight: 150,
    screenWidth: 375,
    recommendSongs: [],
    // 热门歌单数据
    hotMenuList: [],
    // 推荐歌单
    recMenuList: [],
    //巅峰榜数据
    rankingInfos: {}
  },

  onLoad() {
    this.fetchBanner()
    // this.fetchRecommendSongs()
    this.fetchSongMenuList()

    // 发起action
    // 获取推荐歌曲
    if (!this.data.recommendSongs.length) {
      recommendStore.dispatch("fetchRecommendSongsAction")
    }
    rankingStore.dispatch("fetchRankingDataAction")
    recommendStore.onState("recommendSongInfo", this.handleRecommendSongs)
    rankingStore.onState("newRanking", this.handleNewRanking)
    rankingStore.onState("originRanking", this.handleOriginRanking)
    rankingStore.onState("upRanking", this.handleUpRanking)





    // 获取屏幕尺寸
    this.setData({
      screenWidth: app.globalData.screenWidth
    })
  },

  // 获取轮播图数据
  async fetchBanner() {
    const res = await getMusicBanner()
    this.setData({
      musicBanner: res.banners
    })
  },
  //  获取热门歌单
  async fetchSongMenuList() {
    getSongMenuList().then(res => {
      this.setData({
        hotMenuList: res.playlists
      })
    })
    getSongMenuList('华语').then(res => {
      this.setData({
        recMenuList: res.playlists
      })
    })
  },


  // 获取推荐歌曲
  // async fetchRecommendSongs() {
  //   const res = await getPlaylistDetail(3778678)
  //   const recommendSongs = res.playlist.tracks.slice(0,6)
  //   this.setData({
  //     recommendSongs
  //   })
  // },

  // 搜索
  onSearchClick() {
    wx.navigateTo({
      url: '../detail-search/detail-search',
    })
  },
  // 动态设置bannerHeight高度
  onBannerImageLoad(event) {
    querySelectThrottle(".banner-image").then(res => {
      this.setData({
        bannerHeight: res[0].height
      })
    })
  },

  recommendMoreClick() {
    wx.navigateTo({
      url: '/pages/detail-song/detail-song?type=recommend',
    })
    
  },

  onSongItemTap(event){
    const index = event.currentTarget.dataset.index
    playerStore.setState("playSongList",this.data.recommendSongs)
    playerStore.setState("playSongIndex",index)
    
  },

  handleRecommendSongs(value) {
    if(!value.tracks) return 
    this.setData({
      recommendSongs: value.tracks.slice(0, 6)
    })
  },



  handleNewRanking(value) {
    const newRankingInfos = {
      ...this.data.rankingInfos,
      newRanking: value
    }
    this.setData({
      rankingInfos: newRankingInfos
    })
  },
  handleOriginRanking(value) {
    const newRankingInfos = {
      ...this.data.rankingInfos,
      originRanking: value
    }
    this.setData({
      rankingInfos: newRankingInfos
    })
  },
  handleUpRanking(value) {
    const newRankingInfos = {
      ...this.data.rankingInfos,
      upRanking: value
    }
    this.setData({
      rankingInfos: newRankingInfos
    })
  },


  onUnload() {
    recommendStore.offState("recommendSongs", this.handleRecommendSongs)
    rankingStore.offState("newRanking", this.handleNewRanking)
    rankingStore.offState("originRanking", this.handleOriginRanking)
    rankingStore.offState("opRanking", this.handleUpRanking)
  },

  onShareAppMessage() {
    return {
      title: 'Time Music',
      path: '/pages/main-music/main-music',
      imageUrl:''
    }
  },
})